<%-- 
    Document   : productTourPrint
    Created on : Jan 14, 2013, 8:24:41 AM
    Author     : Nguyen Hung
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<%@taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html" %>
<%@taglib prefix="rich" uri="http://richfaces.org/rich" %>
<%@taglib prefix="a4j" uri="http://richfaces.org/a4j" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
         <link rel="stylesheet" type="text/css" href="../css/paging.css"/>
        <script type="text/javascript" language="javascript" src="../scripts/jQuery/confirm.js"></script>
        <script type="text/javascript" language="javascript" src="../scripts/jQuery/jquery.fancybox-1.3.4.pack.js"></script>
        <!-- -->
        <link rel="stylesheet" type="text/css" href="../scripts/tabs/slidingtabs-horizontal.css">
        <script type="text/javascript" src="../scripts/tabs/slidetab.js"></script>
        <!-- -->
        <link rel="stylesheet" type="text/css" href="../css/thickbox.css"/>
        <script type="text/javascript" language="javascript" src="../scripts/jQuery/thickbox.js"></script>
        <script type="text/javascript" language="javascript" src="../scripts/jQuery/jquery.rateit.js"></script>
        <script type="text/javascript" language="javascript" src="../scripts/jQuery/easypaginate.js"></script>
        <link rel="stylesheet" type="text/css" href="../css/rateit.css">


            <link href="../images/favicon.ico" type="image/x-icon" rel="shortcut icon"/>
            <link href="${requestScope.style}" type="text/css" rel="stylesheet" />
            <link href="${requestScope.reset}" type="text/css" rel="stylesheet" />        
            <script type="text/javascript" language="javascript" src="../scripts/jQuery/jquery-1.7.2.min.js"></script>    
            <script type="text/javascript" language="javascript" src="../scripts/jQuery/validate.js" charset="utf-8" ></script>
            <script type="text/javascript" language="javascript" src="../scripts/jQuery/jquery.meio.mask.js"></script>
            <script type="text/javascript" language="javascript" src="../scripts/jQuery/kapi.js" charset="utf-8"></script>
            <link rel="stylesheet" type="text/css" href="../css/jquery.fancybox-1.3.4.css"/>
            <link rel="stylesheet" type="text/css" href="../css/kapiform.css"/>
            <link rel="stylesheet" type="text/css" href="../css/popup.css"/>

        <link rel="stylesheet" href="../css/print-preview.css" type="text/css" media="screen">
        <script src="http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js"></script>
        <script src="../scripts/jQuery/jquery.print-preview.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript" language="javascript" src="../scripts/jQuery/jquery.printElement.min.js"></script>
        <script type="text/javascript" language="javascript">
            var abc  =false;
            var open_cur = 0;
            $j = jQuery.noConflict();
            $j(document).ready(function(){
                initThickBox('.thickbox');
               
                $j('.acb123').live("click",function(){
                   // alert("alo");
                  //   $j('.abc1').css("display", "none");
                    printElem();
                  //  $j('.abc1').css("display", "block");
                });
                
                function printElem(options){
                    $j('.main').printElement(options);
                    
                }
            });
            
            
        </script>
    </head>
    <style>
        .main{
            font-size: 12px;
           
            width: 950px;
            height: auto;
            margin-left: 25px;
            font-family: Arial,Helvetica,sans-serif;
            margin: 0 auto;
        }
        .header{
            width: 100%;
            border-bottom:1px solid #073763; 
            height: 200px;
            float:left;
            background: url('../images/headerPDF.jpg') no-repeat scroll 50% 0 transparent;
        }   
        .foodter{
            width: 100%;
            height: 200px;
            border-top:1px solid #073763; 
            float:left;
            background: url('../images/footerPDF.jpg') no-repeat scroll 50% 0 transparent;
        }
        .content{
            width: 100%;
            height: auto;
            border-bottom:1px solid #073763; 
            float:left;
        }
        .content_header{
            width: 100%;
            float: left;
            height: 30px;
            background-color: #4A5763;
            text-align: center;
            color: white;
            text-transform: uppercase;
            line-height: 30px;
        }
        .content_content{
           
            height: auto;
            width: 100%;
            float: left;
        }
    </style>
    <body>
        <f:view>
            <%--<a4j:form>
                <h:commandButton onclick="this.form.target='_blank'" value="Print PDF" actionListener="#{SPDetailBean.reportPDF1}"/>
</a4j:form> --%>
            <div class="acb123" style="cursor: pointer;color: blue">Click here Print PDF</div>
            <div class="main">
                <a href="customerexpand.jsp"> <div class="header">

                    </div></a>
                <div class="content">
                    <div class="content_header">
                        <h:outputText value=" #{SPDetailBean.titleprintTour} " style="text-transform:uppercase"/>
                    </div>

                    <div class="content_content">
                        
                            <a4j:repeat  value="#{SPDetailBean.listS450}" var="item" rowKeyVar="row" >
                                <h:panelGroup rendered="#{item.sl465==null}">
                                <div style="width: 938px;padding: 6px;margin-top: 4px;float: left;background-color:<h:outputText rendered="#{item.sl465==null}" value="#E6E9EB"/> ">


                                    <div style="float: left;width: 150px;height: 120px;box-shadow:0 0 3px #999999; padding: 3px; background: #ffffff">

                                        <h:panelGroup rendered="#{item.SV454!=null}"><h:graphicImage value="#{item.imageNameFile}" width="150px" height="120px;" alt="" /></h:panelGroup>
                                        <h:panelGroup rendered="#{item.SV454==null}"><h:graphicImage value="../images/default-thumb.gif" width="150px" height="120px;" alt="" /></h:panelGroup>



                                    </div>

                                    <div style="float: left;width: 73%;margin-left: 10px;">
                                        <div style="float: left;width: 617px;margin-top: 0px;margin-left: 0px;"><i> <h:outputText style="color:#547DB1" value="#{item.SV452}"/></i></div>
                                        <div style="float: left;width: 100%;">
                                            <label><b><h:outputText value="Tiêu đề"/></b></label>:
                                            <div style="width:100%;height:26px;">
                                                <b style="color: #1F58A6"> <h:outputText value="#{item.SV451}"/></b>
                                            </div>

                                        </div>
                                        <div style="float: left;width: 100%;" class="to1">
                                            <label><b><h:outputText  value="Nội dung"/></b></label>:
                                            <div style="width:100%;height:auto;">
                                                <h:outputText value="#{item.SV453}" escape="false"/>
                                            </div>
                                        </div>

                                    </div>
                                   
                                </div>
                                </h:panelGroup>
                            </a4j:repeat>
                       
                    </div>
                </div>
                <div class="foodter">

                </div>
            </div>
           
        </f:view>
    </body>
</html>
